<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition>

<ui:composition template="../../resources/tmp/layout_list.xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"                
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:h="http://java.sun.com/jsf/html">

    <ui:define name="title">
        #{rolController.entityName}
    </ui:define>

    <ui:define name="toolbar">  
        <p:commandButton title="#{messages.new}" actionListener="#{rolController.newEvent}" 
                         icon="ui-icon-document" oncomplete="dlg.show()" update=":form-toolbar" />
        <p:commandButton title="#{messages.edit}" disabled="#{rolController.disableButtons}" actionListener="#{rolController.editEvent}"
                         icon="ui-icon-pencil" oncomplete="dlg.show()"  update=":form-dialog"/>
        <p:commandButton title="#{messages.delete}" disabled="#{rolController.disableButtons}" actionListener="#{rolController.remove}"
                         icon="ui-icon-close" update=":form-content :form-toolbar" /> 
    </ui:define>
    
    <ui:define name="content">
        <h:form id="form-content">            
            <p:dataTable id="table-list" var="entity" value="#{rolController.selectable}" paginator="true" rows="10"
                         selection="#{rolController.selected}" selectionMode="single"
                         emptyMessage="#{messages.noData}">
                <f:facet name="header">
                    #{messages.listTitle} #{rolController.entityName}
                </f:facet>

                <p:ajax event="rowSelect" listener="#{rolController.onRowSelect}" update=":form-toolbar" />
                <p:ajax event="rowDblselect" listener="#{rolController.onDblSelect}" update=":form-toolbar" />

                <p:column filterBy="#{entity.name}" headerText="#{messages.name}" sortBy="#{entity.name}">
                    <h:outputText value="#{entity.name}" />
                </p:column>

                <p:column headerText="#{messages.description}">                    
                    <h:outputText value="#{entity.description}" />
                </p:column>  
            </p:dataTable>            
        </h:form>

        <p:dialog id="dialog" header="#{rolController.titleDialog}" widgetVar="dlg" modal="true" closable="false">
            <h:form id="form-dialog">
                <p:panelGrid columns="2">
                    <h:outputLabel for="name" value="#{messages.name}: *" />
                    <p:inputText id="name" value="#{rolController.selected.name}" required="true" requiredMessage="#{messages.required} Nombre" />

                    <h:outputLabel for="description" value="#{messages.description}" />
                    <p:inputTextarea id="description" value="#{rolController.selected.description}" rows="6" cols="30" />

                    <f:facet name="footer">
                        <p:commandButton id="button-edit" value="#{messages.save}" icon="ui-icon-disk"
                                         update=":form-toolbar:growl :form-content :form-dialog" actionListener="#{rolController.edit}" 
                                         oncomplete="handleDialogRequest(xhr, status, args)"/>
                        <p:button value="#{messages.cancel}" icon="ui-icon-cancel" outcome="roles" />
                    </f:facet>
                </p:panelGrid>
            </h:form>
        </p:dialog>
    </ui:define>

</ui:composition>